<template>
    <div>
        <div ref="vantaRef" style="width:100%;height:100vh">
            <div class="my_title">本网站贡献者：</div>
            <div style="display: flex">
                <div style="display: flex"><img class="wumu" src="../../assets/images/舞木.jpg">
                    <h1 style="color: #2abd53;font-size: 30px;font-weight: bolder;">舞木</h1>
                </div>
                <div style="display: flex"><img class="zhikang" src="../../assets/images/智康.jpg">
                    <h1 style="color: #d21b7c;font-size: 30px;font-weight: bolder;">czk</h1>
                </div>
            </div>
        </div>

    </div>

</template>

<script>
import * as THREE from 'three'
import BIRDS from 'vanta/src/vanta.birds'

export default {
    name: "hello",
    data() {
        return {};
    },
    mounted() {
        // this.vantaEffect = BIRDS({
        //     el: this.$refs.vantaRef,
        //     THREE: THREE
        // })
    },
    beforeDestroy() {
        if (this.vantaEffect) {
            this.vantaEffect.destroy()
        }
    },
    methods: {},

};
</script>

<style>
.wumu {
    overflow: hidden;
    width: 100px;
    border-radius: 50%;
}

.zhikang {
    overflow: hidden;
    width: 100px;
    border-radius: 50%;
}

.my_title {
    z-index: 999;
    color: aquamarine;
    font-size: 30px;
    font-weight: bolder;
}
</style>
